<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jQuery-3.4.1.min.js"></script>
    <link rel="stylesheet" href="amazeUI/css/amazeui.css">
    <script src="amazeUI/js/amazeui.js"></script>
    <style>
        .btn-list {
            display: flex;
            width: 100%;
            flex-wrap: wrap;
        }

        .tag-item {
            background-color: rgba(59, 180, 242, 0.7);
            border: 1px #3bb4f2 solid;
            border-radius: 16px;
            display: flex;
            justify-content: space-between;
            line-height: 35px;
            margin: 3px 3px;
        }

        .tag-item > span {
            display: block;
            padding: 0 8px;
        }

        .tag-item > .am-close {
            line-height: 32px;
            font-size: 28px;
        }

        .tag-item .add-tag-input {
            width: 30%;
        }
    </style>
</head>
<body>
<div class="am-g">
    <div class="am-u-lg-4">
        <div class="am-form">
            <div class="am-form-group">
                <label for="e">分类标签</label>
                <input name="e" id="e" type="text">
            </div>
            <div class="am-form-group">
                <label for="">分类标签</label>
                <div class="btn-list">
                    <div class="tag-item">
                        <span>一个小标签</span>
                        <a href="#" class="am-close">&times;</a>
                    </div>
                    <div class="tag-item">
                        <span>一个小标签</span>
                        <a href="#" class="am-close">&times;</a>
                    </div>
                    <div class="tag-item">
                        <span>一个小标签</span>
                        <a href="#" class="am-close">&times;</a>
                    </div>
                    <div class="tag-item">
                        <span>一个小标签</span>
                        <a href="#" class="am-close">&times;</a>
                    </div>
                    <div class="tag-item">
                        <span>一个小标签</span>
                        <a href="#" class="am-close">&times;</a>
                    </div>
                    <div class="tag-item">
                        <span>一个小标签</span>
                        <a href="#" class="am-close">&times;</a>
                    </div>

                    <button class="am-btn am-btn-primary" id="addTag-btn">新建标签</button>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(function () {
        $("#addTag-btn").click(function () {
            let html = "<div class=\"tag-item\">\n" +
                "            <input class='add-tag-input'/>\n" +
                "                        <a href=\"#\" class=\"am-close\">&times;</a>\n" +
                "                    </div>";
            $(".btn-list").children(".tag-item:last").after(html);
        });

        $(".tag-item a").click(function () {
            $(this).parent().remove();
        });
    });
</script>
</body>
</html>